import React, {Component} from 'react';
import {Button, Form, Input, Space} from "antd";

class EditorForm extends Component {
    componentDidMount() {
        const {data} = this.props
        if (data) {
            this.questionRef.setFieldsValue({
                questionTitle: data.questionTitle,
                questionAnswer: data.questionAnswer
            })
        }
    }

    onFinish = value => {
        const {onFinish, formType, data} = this.props
        if (formType === 'add') {
            value.questionClassifyId = data ? data.questionClassifyId : '1'
            onFinish(value)
        } else {
            value.questionId = data.questionId
            onFinish(value)
        }
    }

    render() {
        const {btnLoading, handleCancel} = this.props
        return <Form ref={ref => this.questionRef = ref} onFinish={this.onFinish}>
            <Form.Item name={'questionTitle'} rules={[{required: true, message: '请输入问题'}]}>
                <Input maxLength={10} placeholder={'请输入问题'}/>
            </Form.Item>
            <Form.Item name={'questionAnswer'} rules={[{required: true, message: '请输入答案'}]}>
                <Input.TextArea maxLength={500} rows={4} showCount/>
            </Form.Item>
            <div className="add-button-group">
                <Space size="large">
                    <Button key="back" onClick={handleCancel}>
                        取 消
                    </Button>
                    <Button style={{marginRight: 0}} type="primary" loading={btnLoading} htmlType="primary">
                        保 存
                    </Button>
                </Space>
            </div>
        </Form>
    }
}

export default EditorForm;